<template>
  <div class="notice">
    <detailSection title="预定需知" >
        <div class="notice-inner">
            <template v-for="(item , index) in rules.orderRules" :key="index">
                <div class="item">
                    <span class="title">{{ item.title }}</span>
                    <span class="intro">{{ item.introduction }}</span>
                    <span class="tip" v-if="item.tip">{{ item.tip }}</span>
                </div>
            </template>
        </div>
    </detailSection>
  </div>
</template>

<script setup>
import detailSection from '@/components/detail-section/detail-section.vue';
import usedetailstore from '@/stores/modules/detail';
import { storeToRefs } from 'pinia';
const detailstore=usedetailstore();
const {houseinfos}=storeToRefs(detailstore);
const mainPart=houseinfos.value.mainPart;
// console.log(mainPart);

const rules=mainPart.dynamicModule.rulesModule;
// console.log(rules);


</script>

<style lang="less" scoped>
.notice-inner {
  .item {
    display: flex;
    margin: 10px 0 20px;
    font-size: 12px;

    .title {
      width: 64px;
      color: #666;
    }

    .intro {
      flex: 1;
      color: #333;
    }
  }
}
</style>